import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:get/get.dart';

import 'invsend_logic.dart';
import 'invsend_state.dart';

class InvsendPage extends StatelessWidget {
  const InvsendPage({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    final InvsendLogic logic = Get.put(InvsendLogic());
    final InvsendState state = Get.find<InvsendLogic>().state;

    return Scaffold(
      backgroundColor: Colors.white,
      appBar: AppBar(
        backgroundColor: Colors.white,
        elevation: 0,
        centerTitle: true,
        title: Text(
          '输入邮箱、手机号邀请',
          style: TextStyle(
            color: Colors.black,
            fontSize: 16.sp,
            fontFamily: 'Inter',
            fontWeight: FontWeight.w600,
            letterSpacing: 1,
          ),
        ),
        leading: IconButton(
          icon: Icon(Icons.arrow_back_ios, color: Colors.black, size: 20.sp),
          onPressed: () => Get.back(),
        ),
      ),
      body: Padding(
        padding: EdgeInsets.symmetric(horizontal: 32.w),
        child: Form(
          key: logic.formKey,
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              SizedBox(height: 40.h),
              Text(
                '使用手机号搜索时，建议先输入国家/地区码（86）',
                style: TextStyle(
                  color: Colors.black,
                  fontSize: 14.sp,
                  fontFamily: 'Inter',
                  fontWeight: FontWeight.w400,
                  letterSpacing: 1,
                ),
              ),
              SizedBox(height: 47.h),
              TextFormField(
                controller: logic.contactController,
                validator: logic.validateContact,
                decoration: InputDecoration(
                  filled: true,
                  fillColor: const Color(0xFFF3F5F9),
                  border: OutlineInputBorder(
                    borderRadius: BorderRadius.circular(24.r),
                    borderSide: BorderSide.none,
                  ),
                  hintText: '输入邮箱/手机号',
                  hintStyle: TextStyle(
                    color: const Color(0xFF979797),
                    fontSize: 14.sp,
                    fontFamily: 'Inter',
                    fontWeight: FontWeight.w400,
                    letterSpacing: 1,
                  ),
                  contentPadding: EdgeInsets.symmetric(
                    horizontal: 20.w,
                    vertical: 20.h,
                  ),
                ),
                keyboardType: TextInputType.emailAddress,
              ),
              SizedBox(height: 20.h),
              // 错误提示区域
              Obx(() => state.isLoading.value
                  ? Center(
                      child: Padding(
                        padding: EdgeInsets.symmetric(vertical: 10.h),
                        child: const CircularProgressIndicator(),
                      ),
                    )
                  : const SizedBox.shrink()),
              const Spacer(),
              Center(
                child: SizedBox(
                  width: 265.w,
                  height: 48.h,
                  child: Obx(
                    () => ElevatedButton(
                      onPressed: state.isLoading.value
                          ? null
                          : logic.sendInvitation,
                      style: ElevatedButton.styleFrom(
                        backgroundColor: const Color(0xFF2573FF),
                        shape: RoundedRectangleBorder(
                          borderRadius: BorderRadius.circular(12.r),
                        ),
                        disabledBackgroundColor: const Color(0xFFBBDEFB),
                      ),
                      child: Text(
                        '确认',
                        style: TextStyle(
                          color: Colors.white,
                          fontSize: 20.sp,
                          fontFamily: 'Nunito',
                          fontWeight: FontWeight.w600,
                        ),
                      ),
                    ),
                  ),
                ),
              ),
              SizedBox(height: 40.h),
            ],
          ),
        ),
      ),
      bottomNavigationBar: Container(
        height: 20.h,
        alignment: Alignment.center,
        child: Container(
          width: 135.w,
          height: 5.h,
          decoration: ShapeDecoration(
            color: const Color(0xFF161C18),
            shape: RoundedRectangleBorder(
              borderRadius: BorderRadius.circular(100.r),
            ),
          ),
        ),
      ),
    );
  }
}
